<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title><%= blog.title %></title>
  <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/4.1.0/css/bootstrap.min.css">
  <link rel="stylesheet" href="/css/sign.css">
</head>
<body>
<form class="needs-validation" novalidate method="post" enctype="multipart/form-data">
  <h1 class="h3 mb-3 font-weight-normal text-center">Please sign up</h1>
  <div class="form-group">
    <label for="name">用户名</label>
    <input type="text" id="name" name="name" class="form-control" required>
  </div>
  <div class="form-group">
    <label for="password">密码</label>
    <input type="password" id="password" name="password" class="form-control" required>
    <div class="invalid-feedback">Must be 8-20 characters long.</div>
  </div>
  <div class="form-group">
    <label for="repassword">重复密码</label>
    <input type="password" id="repassword" name="repassword" class="form-control" required>
  </div>
  <div class="form-group">
    <label for="gender">性别</label>
    <select class="form-control" name="gender" id="gender" required>
      <option selected value="m">男</option>
      <option value="f">女</option>
      <option value="x">保密</option>
    </select>
  </div>
  <div class="form-group">
    <label for="avatar">头像</label>
    <div class="custom-file">
      <input type="file" class="custom-file-input" id="avatar" name="avatar" required>
      <label class="custom-file-label" for="avatar">Choose file</label>
    </div>
  </div>
  <div class="form-group">
    <label for="bio">个人简介</label>
    <textarea class="form-control" id="bio" name="bio" rows="3" required></textarea>
  </div>
  <button class="btn btn-lg btn-primary btn-block" type="submit">注册</button>
</form>
<script>
// Example starter JavaScript for disabling form submissions if there are invalid fields
(function() {
  'use strict';
  window.addEventListener('load', function() {
    // Fetch all the forms we want to apply custom Bootstrap validation styles to
    var forms = document.getElementsByClassName('needs-validation');
    // Loop over them and prevent submission
    var validation = Array.prototype.filter.call(forms, function(form) {
      form.addEventListener('submit', function(event) {
        if (form.checkValidity() === false) {
          event.preventDefault();
          event.stopPropagation();
        }
        form.classList.add('was-validated');
      }, false);
    });
  }, false);
})();
</script>
<%- include('../common/footer') %>
